<template>
  <div
    v-if="crud.props.searchToggle"
  >
    <el-input v-model="query.contractCode" clearable size="small" placeholder="合同编号" style="width: 120px;" class="filter-item" />
    <el-select v-model="query.isArchived" clearable size="small" placeholder="是否已归档" class="filter-item" style="width: 120px">
      <el-option v-for="item in isArchivedOptions" :key="item.key" :label="item.display_name" :value="item.key" />
    </el-select>
    <el-input v-model="query.projectName" clearable size="small" placeholder="项目名称" style="width: 180px;" class="filter-item" />
    <el-input v-model="query.projectEntrustedCompany" clearable size="small" placeholder="项目委托单位" style="width: 180px;" class="filter-item" />
    <el-select v-model="query.projectAddressId" filterable clearable size="small" placeholder="项目区域" class="filter-item" style="width: 120px">
      <el-option v-for="item in dict.projectAddressId" :key="item.value" :label="item.label" :value="item.value" />
    </el-select>
    <el-input v-model="query.projectAddress" clearable size="small" placeholder="项目地点" style="width: 180px;" class="filter-item" />
    <el-select v-model="query.projectType" filterable clearable size="small" placeholder="项目类型" class="filter-item" style="width: 120px">
      <el-option v-for="item in dict.projectType" :key="item.value" :label="item.label" :value="item.value" />
    </el-select>
    <el-select v-model="query.projectSource" clearable size="small" placeholder="项目来源" class="filter-item" style="width: 120px">
      <el-option v-for="item in dict.projectSource" :key="item.value" :label="item.label" :value="item.value" />
    </el-select>
    <el-select v-model="query.undertakeDepartment" filterable clearable size="small" placeholder="承接部门" class="filter-item" style="width: 120px">
      <el-option v-for="item in dict.undertakeDepartment" :key="item.value" :label="item.label" :value="item.value" />
    </el-select>
    <el-input v-model="query.projectLeader" clearable size="small" placeholder="项目负责人" style="width: 150px;" class="filter-item" />
    <el-input v-model="query.projectMainMember" clearable size="small" placeholder="项目主要成员" style="width: 150px;" class="filter-item" />
    <el-input v-model="query.projectAssistMember" clearable size="small" placeholder="项目辅助成员" style="width: 150px;" class="filter-item" />
    <el-date-picker v-model="query.projectStartTimeRange" type="daterange" class="date-item" start-placeholder="项目开始时间" end-placeholder="选择时间区间" :picker-options="pickerOptions" value-format="yyyy-MM-dd" />
    <el-date-picker v-model="query.projectFinishTimeRange" type="daterange" class="date-item" start-placeholder="项目结束时间" end-placeholder="选择时间区间" :picker-options="pickerOptions" value-format="yyyy-MM-dd" />
    <el-select v-model="query.invoiceStatus" clearable size="small" placeholder="是否已开票" class="filter-item" style="width: 120px">
      <el-option v-for="item in invoiceStatusOptions" :key="item.key" :label="item.display_name" :value="item.key" />
    </el-select>
    <rrOperation />
  </div>
</template>

<script>
import { header } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
export default {
  components: { rrOperation },
  mixins: [header()],
  props: {
    dict: {
      type: Object,
      required: true
    },
    permission: {
      type: Object,
      required: true
    },
    isArchivedOptions: {
      type: Array,
      required: true
    },
    pickerOptions: {
      type: Object,
      required: true
    },
    invoiceStatusOptions: {
      type: Array,
      required: true
    }
  }
}
</script>
